<template>
  <t-table
    :data="data"
    :columns="columns"
    :loading="loading"
    :pagination="pagination"
    @page-change="onPageChange"
  >
    <template #status="{ row }">
      <t-tag :theme="getStatusTheme(row.status)" :variant="'light'">
        {{ getStatusText(row.status) }}
      </t-tag>
    </template>
    <template #paymentType="{ row }">
      <t-tag theme="primary" variant="light">
        {{ getPaymentTypeText(row.paymentType) }}
      </t-tag>
    </template>
    <template #contractType="{ row }">
      <t-tag theme="success" variant="light">
        {{ getContractTypeText(row.contractType) }}
      </t-tag>
    </template>
    <template #operation="{ row }">
      <t-space>
        <t-link theme="primary" hover="color" @click="handleEdit(row)">
          编辑
        </t-link>
        <t-link theme="danger" hover="color" @click="handleDelete(row)">
          删除
        </t-link>
      </t-space>
    </template>
  </t-table>
</template>

<script setup lang="ts">
import { computed } from 'vue';
import type { PrimaryTableCol, TableRowData } from 'tdesign-vue-next';
import type { ContractInfo } from '@/api/contract';

const props = defineProps<{
  data: ContractInfo[];
  loading: boolean;
  pagination: {
    current: number;
    pageSize: number;
    total: number;
  };
}>();

const emit = defineEmits(['page-change', 'edit', 'delete']);

const columns = computed<PrimaryTableCol[]>(() => [
  {
    title: '序号',
    colKey: 'index',
    width: 80,
  },
  {
    title: '合同表编号',
    colKey: 'no',
    width: 120,
  },
  {
    title: '合同表名称',
    colKey: 'name',
    width: 160,
  },
  {
    title: '状态',
    colKey: 'status',
    width: 100,
    cell: 'status',
  },
  {
    title: '付款类型',
    colKey: 'paymentType',
    width: 120,
    cell: 'paymentType',
  },
  {
    title: '合同类型',
    colKey: 'contractType',
    width: 120,
    cell: 'contractType',
  },
  {
    title: '合同金额',
    colKey: 'amount',
    width: 120,
    align: 'right',
  },
  {
    title: '管理员姓名',
    colKey: 'adminName',
    width: 120,
  },
  {
    title: '创建时间',
    colKey: 'createTime',
    width: 160,
  },
  {
    title: '更新时间',
    colKey: 'updateTime',
    width: 160,
  },
  {
    title: '操作',
    colKey: 'operation',
    width: 120,
    fixed: 'right',
  },
]);

const getStatusText = (status: number) => {
  const map: Record<number, string> = {
    1: '草稿',
    2: '审核中',
    3: '已生效',
    4: '已完成',
    5: '已终止',
  };
  return map[status] || '未知';
};

const getStatusTheme = (status: number): 'default' | 'success' | 'primary' | 'warning' | 'danger' => {
  const map: Record<number, 'default' | 'success' | 'primary' | 'warning' | 'danger'> = {
    1: 'default',
    2: 'warning',
    3: 'success',
    4: 'primary',
    5: 'danger',
  };
  return map[status] || 'default';
};

const getPaymentTypeText = (type: number) => {
  const map: Record<number, string> = {
    1: '一次性付款',
    2: '分期付款',
    3: '按进度付款',
  };
  return map[type] || '未知';
};

const getContractTypeText = (type: number) => {
  const map: Record<number, string> = {
    1: '采购合同',
    2: '销售合同',
    3: '服务合同',
  };
  return map[type] || '未知';
};

const handleEdit = (row: ContractInfo) => {
  emit('edit', row);
};

const handleDelete = (row: ContractInfo) => {
  emit('delete', row);
};

const onPageChange = (pageInfo: { current: number; pageSize: number }) => {
  emit('page-change', pageInfo);
};
</script> 